<!DOCTYPE html>
<html>
  <head>
    <meta charset="UTF-8">
    <title>欢迎页面-X-admin2.0</title>
    <meta name="renderer" content="webkit">
    <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
    <meta name="viewport" content="width=device-width,user-scalable=yes, minimum-scale=0.4, initial-scale=0.8,target-densitydpi=low-dpi" />
    <link rel="stylesheet" href="../css/element.css">
    <link rel="stylesheet" href="../css/font.css">
    <link rel="stylesheet" href="../css/xadmin.css">
    <script src="../js/vue.js"></script>
    <script src="../js/element.js"></script>
    <script src="../js/axios.js"></script>
    <script src="../jss/requestjs.js"></script>
    <script src="../js/jquery-3.5.1.min.js"></script>
    <script src="../lib/layui/layui.js" charset="utf-8"></script>
    <script src="../js/xadmin.js"></script>
    <script src="../js/md5.js"></script>
    <script src="../js/common.js"></script>
    <script src="../adminjs/admin-role.js"></script>
  </head>


  <body>
  <div class="x-nav">
      <span class="layui-breadcrumb">
        <a href="">首页</a>
        <a href="">演示</a>
        <a>
          <cite>导航元素</cite></a>
      </span>
    <a class="layui-btn layui-btn-small" style="line-height:1.6em;margin-top:3px;float:right" href="javascript:location.replace(location.href);" title="刷新">
      <i class="layui-icon" style="line-height:30px">ဂ</i></a>
  </div>
  <div class="x-body" id="app">
    <xblock>
      <button class="layui-btn" @click="adds"><i class="layui-icon"></i>添加</button>
      <span class="x-right" style="line-height:40px">共有数据：{{pagination.total}}条</span>
    </xblock>
    <div>
    <el-table
            :data="rolearray"
            style="width:60%"
            row-key="rid"
            border
            lazy >
      <el-table-column
              prop="rid"
              label="id"
              min-width="5%" align="center">
      </el-table-column>
      <el-table-column
              prop="rname"
              label="姓名"
              min-width="10%" align="center">
      </el-table-column>
      <el-table-column
              prop="status"
              label="状态"
              min-width="5%" align="center" >
        <template slot-scope="scope">
          <el-switch
                  v-model="scope.row.status==0"
                  @change="myswitch(scope.row)">
          </el-switch>
        </template>
      </el-table-column>
      <el-table-column
              prop="createTime"
              label="日期"
              min-width="20%" align="center">
        <template slot-scope="scope">
          {{scope.row.createTime | mytime }}
        </template>
      </el-table-column>
      <el-table-column label="操作" min-width="15%" align="center">
          <template slot-scope="scope"><!--@click="roleupdate(scope.row.rid,scope.row.rname)-->
                  <el-button type="primary" icon="el-icon-edit" circle @click="roleupdate(scope.row.rid,scope.row.rname)"></el-button>
              <el-button type="danger" icon="el-icon-delete" circle @click="deleteSysRolemethod(scope.row.rid,scope.row.rname)"></el-button>
          </template>
      </el-table-column>

    </el-table>
        <div>
            <el-pagination background layout="prev, pager, next,sizes,total" :total="pagination.total" :page-size="pagination.pageSize"
                           :current-page="pagination.pageNum" @size-change="sizeChange" @current-change="findBlogPageList" >
            </el-pagination>
        </div>


      <div style="position: relative;left: 1100px;bottom: 333px;">
        <p>权限详情</p>
        <el-tree
                :data="data"
                show-checkbox
                node-key="rid"
                :props="defaultProps">
        </el-tree>
      </div>

    </div>



      <el-dialog
              title="修改状态"
              :visible.sync="statevalue"
              width="30%">
          <span>你确定要{{role.myvalue}}当前用户吗?</span>
          <span slot="footer" class="dialog-footer">
    <el-button @click="statevalue = false">取 消</el-button>
    <el-button type="primary" @click="updatestate">确 定</el-button>
  </span>
      </el-dialog>

    <el-dialog title="角色新增"
               width="50%"
               :visible.sync="addrole">
        <span>
           <div class="layui-form-item">
              <label for="username" class="layui-form-label">
                  <span class="x-red">*</span>角色名称
              </label>
              <div class="layui-input-inline">
                  <input type="text" id="username"  autocomplete="off" class="layui-input" v-model="roles.rname">
              </div>
          </div>
          <div class="layui-form-item">
        <el-tree
                :data="mydata"
                show-checkbox
                node-key="rid"
                :props="defaultProps"
                :check-strictly="true"
                @check="handleCheckChanges">
        </el-tree>
             </div>
        </span>
      <span slot="footer" class="dialog-footer">
    <el-button @click="addrole = false">取 消</el-button>
    <el-button type="primary" @click="confirmaddrole">新 增</el-button>
  </span>
    </el-dialog>


    <el-dialog title="角色修改"
               width="50%"
               :visible.sync="roleupdatevalue">
        <span>
           <div class="layui-form-item">
              <label for="username" class="layui-form-label">
                  <span class="x-red">*</span>角色名称
              </label>
              <div class="layui-input-inline">
                  <input type="text" id="username"  autocomplete="off" class="layui-input" v-model="roles.rname">
              </div>
          </div>
          <div class="layui-form-item">
       <el-tree
                :data="updatedata"
                show-checkbox
                node-key="rid"
                :props="defaultProps"
                :default-checked-keys="updatearray"
                :check-strictly="true"
                :default-expand-all="true"
                @check="updatehandleCheckChanges">
        </el-tree>
             </div>
        </span>
      <span slot="footer" class="dialog-footer">
    <el-button @click="roleupdatevalue = false">取 消</el-button>
    <el-button type="primary" @click="confirmupdate">修 改</el-button>
  </span>
    </el-dialog>

      </el-dialog>
      <el-dialog title="角色删除"
                 width="50%"
                 :visible.sync="deleteSysRole">
        <span>
            你确定要删除角色{{roles.rname}}?
        </span>
          <span slot="footer" class="dialog-footer">
    <el-button @click="deleteSysUser = false">取 消</el-button>
    <el-button type="primary" @click="confirmdelRole">删 除</el-button>
  </span>
      </el-dialog>




  </div>
    <script>var _hmt = _hmt || []; (function() {
        var hm = document.createElement("script");
        hm.src = "https://hm.baidu.com/hm.js?b393d153aeb26b46e9431fabaf0f6190";
        var s = document.getElementsByTagName("script")[0];
        s.parentNode.insertBefore(hm, s);
      })();</script>
  </body>

</html>